{% extends 'PHPDishWebBundle::layout.html.twig' %}

{% set title = topic is defined ? 'topic.edit_topic'|trans : 'topic.add_topic'|trans %}

{% block title %}
    {{ title }}
{% endblock %}

{% block script %}
    <script type="text/javascript" src="{{ asset('build/js/topic.js') }}"></script>
{% endblock %}

{% block content %}
    <div class="container" role="main">
        <div class="row">
            <article class="col-md-9">
                <div class="panel panel-u add-topic" id="add-topic">
                    <div class="panel-heading">
                        {{ title }}
                    </div>
                    <div class="panel-body">
                        {{ form_start(form, {'attr': {'id': 'add-topic-form', 'class': 'topic'}}) }}
                        {{ form_errors(form) }}
                        <div class="form-group">
                            {{ form_widget(form.title, {'attr': {'class': 'form-control title', placeholder: 'topic.form.title'|trans}}) }}
                            {{ form_errors(form.title) }}
                        </div>
                        <div class="form-group editor">
                            {{ form_widget(form.originalBody, {'required': false, 'attr': {'class': 'form-control body', placeholder: 'topic.form.body'|trans}}) }}
                            {{ form_errors(form.originalBody) }}
                        </div>
                        <div class="form-group">
                            {{ form_widget(form.threads, {'attr': {'class': 'thread', placeholder: 'topic.form.thread'|trans}}) }}
                            {{ form_errors(form.threads) }}
                            <div class="recommend-threads tags" data-role="recommend-threads">
                                {% for thread in threads %}
                                    <a href="javascript:void(0);" class="tag">
                                        {% if thread.cover %}
                                            <img src="{{ asset(thread.cover)|imagine_filter('middle_square') }}" class="tag-image"/>
                                        {% endif %}
                                        {{ thread.name }}
                                    </a>
                                {% endfor %}
                            </div>
                        </div>
                        <div class="form-group">
                            <button type="submit" class="btn u-btn-primary submit-btn"><i class="if i-publish"></i> {{ 'topic.form.publish'|trans }}</button>
                            <span class="preview-action" data-action="preview"><i class="if i-view"></i> {{ 'topic.form.preview'|trans }}</span>
                        </div>
                        {{ form_end(form) }}
                        <div class="preview-panel markdown-body hidden" data-role="preview-panel">
                            {{ 'topic.preview_area'|trans }}
                        </div>
                    </div>
                </div>
            </article>
            <div class="col-md-3">
                {% include 'PHPDishWebBundle:User:_user_plate.html.twig' %}
            </div>
        </div>
    </div>
{% endblock %}